<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
      <!-- 
        构造函数（类）的原型对象 Person.prototype
        用于共享数据给类的实例 原型对象的任何数据实例都可以直接访问
        将所有实例通用的属性或方法 挂载在原型对象身上 避免了每个实例都各自持有一份 从而极大地节约了内存
        实例通过__proto__属性找到构造函数的原型对象 mjst.__proto__
        构造函数（类）的原型对象 和 实例的原型属性 指向同一个对象 mjst.__proto__ === Person.prototype
        本例中 mjst自身没有fight方法 但是通过mjst.__proto__找到原型对象以后 通过访问原型对象的fight方法实现了 mjst.fight
       -->
    <script>
      function Person(name, age) {
        this.name = name;
        this.age = age;

        // this.fight = function () {
        //   console.log(`${this.age}岁${this.name}又在干架了！`);
        // };
      }

      // 让爹（构造函数）的老婆（原型对象）学会干仗
      // 妈（类的原型对象）会把自己的全部都共享给孩子（类的实例）
      Person.prototype.fight = function () {
        console.log(`${this.age}岁${this.name}又在干架了！`);
      };

      const mjst = new Person("灭绝师太", 60);
      mjst.fight();

      const tstl = new Person("天山童姥", 80);
      tstl.fight();

      /* 爹（构造函数） 妈（构造函数的原型对象） 孩子（构造函数的实例） */
      console.log("爹的老婆", Person.prototype);
      console.log("孩子的妈", mjst.__proto__);
      console.log("爹的老婆就是孩子的妈", Person.prototype === mjst.__proto__);
      console.log(
        "孩子的干仗方法其实是他妈的干仗方法",
        mjst.fight === mjst.__proto__.fight
      );
      console.log("看看孩子吧",mjst);
    </script>
  </body>
</html>
